<template>
  <view class="page">
    <view class="page-ctx">
      <!-- 		<view class="page-title">
				我的评价
			</view> -->
      <view class="box-reviews">
        <reviewList :list="reviews" :showRelativeProduct="true" />
      </view>

      <view class="load-more-box" style="margin-top: 50rpx">
        <u-loadmore :status="loadmore_status" @loadmore="loadMore" />
      </view>
    </view>
  </view>
</template>

<script>
import reviewList from "@/components/review/reviewList.vue";

export default {
  components: {
    reviewList,
  },
  data() {
    return {
      reviews: [
        {
          nickname: "111",
          createdTime: "111",
          productKeyVals: "11",
          content: "1111111111",
        },
      ],
      count: 0,
      pagination: {
        page: 1,
        pageNum: 10,
      },
      loadmore_status: "loadmore", //loadmore  / loading / nomore
    };
  },
  onLoad(option) {
    this.setView();
  },
  onShow() {},
  onHide() {},

  onPullDownRefresh() {},
  onReachBottom() {
    this.loadMore();
  },

  methods: {
    loadMore() {
      if (this.loadmore_status == "loadmore") {
        this.loadmore_status = "loading";
        this.pagination.page++;
        this.query_reviews();
      }
    },

    initQuery() {
      this.reviews = [];
      this.pagination.page = 1;
      this.loadmore_status = "loadmore";
    },

    setView() {
      this.query_reviews();
    },

    query_reviews() {
      this.$api({
        url: "/service.php",
        method: "get",
        data: {
          action: "users_myselfComments",
          ...this.pagination,
        },
      }).then((res) => {
        if (res.code == 200) {
          this.count = res.data.count;

          res.data.list.forEach((v) => {
            v.picList = v.imgs;
            this.format_review_item_star(v);
          });

          this.reviews = this.reviews.concat(res.data.list);
          this.loadmore_status =
            res.data.count > this.reviews.length ? "loadmore" : "nomore";
        }
      });
    },

    //处理评分数据
    format_review_item_star(item) {
      let starItems = [];
      for (var i = 1; i <= 5; i++) {
        starItems.push({
          value: i <= item.star ? 1 : 0,
        });
      }
      item.starItems = starItems;
    },
  },
};
</script>

<style lang="scss">
page {
  background: #f8f8f8;
}
</style>

<style lang="scss" scoped>
.page-ctx {
  padding: 20rpx 32rpx;
}

.box-reviews {
  margin-top: 0;
  // background: #FFFFFF;
  // border-radius: 20rpx 20rpx 20rpx 20rpx;
  padding: 0 0rpx;
}

::v-deep .box-reviews .reviews-list .reviews-item {
  background: #ffffff;
  margin-bottom: 20rpx;
  padding: 20rpx;
  border-bottom: none;
}
</style>
